﻿<?xml version="1.0" encoding="utf-8"?><Articles><Article><ArticlesID>667</ArticlesID><Title>Tạo hiệu ứng tuyết rơi với Javascript</Title><Body>&amp;lt;p&amp;gt;M&amp;amp;ugrave;a đ&amp;amp;ocirc;ng đang đến rồi v&amp;amp;agrave; gi&amp;amp;aacute;ng sinh cũng sắp đến gần tại sao bạn kh&amp;amp;ocirc;ng thử l&amp;amp;agrave;m cho website của bạn trỏ n&amp;amp;ecirc;n lung linh hơn với hiệu ứng tuyết rơi nhỉ&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;C&amp;amp;aacute;c bạn tạo 1 file js c&amp;amp;oacute; nội dung như sau:&amp;lt;/p&amp;gt;
&amp;lt;pre class=&amp;quot;brush: jscript;&amp;quot; title=&amp;quot;code&amp;quot;&amp;gt;
var snowmax=60

var snowcolor=new Array(&amp;amp;quot;#AAAACC&amp;amp;quot;,&amp;amp;quot;#DDDDFF&amp;amp;quot;,&amp;amp;quot;#CCCCDD&amp;amp;quot;,&amp;amp;quot;#F3F3F3&amp;amp;quot;,&amp;amp;quot;#F0FFFF&amp;amp;quot;)

var snowtype=new Array(&amp;amp;quot;Arial Black&amp;amp;quot;,&amp;amp;quot;Arial Narrow&amp;amp;quot;,&amp;amp;quot;Times&amp;amp;quot;,&amp;amp;quot;Comic Sans MS&amp;amp;quot;)

var snowletter=&amp;amp;quot;*&amp;amp;quot;

var sinkspeed=0.6

var snowmaxsize=25

var snowminsize=12

var snowingzone=1

  /*
   //   * NO CONFIGURATION BELOW HERE *
*/

var snow=new Array()
var marginbottom
var marginright
var timer
var i_snow=0
var x_mv=new Array();
var crds=new Array();
var lftrght=new Array();
var browserinfos=navigator.userAgent
var ie5=document.all&amp;amp;amp;&amp;amp;amp;document.getElementById&amp;amp;amp;&amp;amp;amp;!browserinfos.match(/Opera/)
var ns6=document.getElementById&amp;amp;amp;&amp;amp;amp;!document.all
var opera=browserinfos.match(/Opera/)  
var browserok=ie5||ns6||opera

function randommaker(range) {        
    rand=Math.floor(range*Math.random())
    return rand
}

function initsnow() {
    if (ie5 || opera) {
        marginbottom = document.body.clientHeight
        marginright = document.body.clientWidth
    }
    else if (ns6) {
        marginbottom = window.innerHeight
        marginright = window.innerWidth
    }
    var snowsizerange=snowmaxsize-snowminsize
    for (i=0;i&amp;amp;lt;=snowmax;i++) {
        crds[i] = 0;                      
        lftrght[i] = Math.random()*15;        
        x_mv[i] = 0.03 + Math.random()/10;
        snow[i]=document.getElementById(&amp;amp;quot;s&amp;amp;quot;+i)
        snow[i].style.fontFamily=snowtype[randommaker(snowtype.length)]
        snow[i].size=randommaker(snowsizerange)+snowminsize
        snow[i].style.fontSize=snow[i].size
        snow[i].style.color=snowcolor[randommaker(snowcolor.length)]
        snow[i].sink=sinkspeed*snow[i].size/5
        if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
        if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
        if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
        if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
        snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size)
        snow[i].style.left=snow[i].posx
        snow[i].style.top=snow[i].posy
    }
    movesnow()
}

function movesnow() {
    for (i=0;i&amp;amp;lt;=snowmax;i++) {
        crds[i] += x_mv[i];
        snow[i].posy+=snow[i].sink
        snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i]);
        snow[i].style.top=snow[i].posy
        
        if (snow[i].posy&amp;amp;gt;=marginbottom-2*snow[i].size || parseInt(snow[i].style.left)&amp;amp;gt;(marginright-3*lftrght[i])){
            if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
            if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
            if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
            if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
            snow[i].posy=0
        }
    }
    var timer=setTimeout(&amp;amp;quot;movesnow()&amp;amp;quot;,50)
}

for (i=0;i&amp;amp;lt;=snowmax;i++) {
    document.write(&amp;amp;quot;&amp;amp;lt;span id='s&amp;amp;quot;+i+&amp;amp;quot;' style='position:absolute;top:-&amp;amp;quot;+snowmaxsize+&amp;amp;quot;'&amp;amp;gt;&amp;amp;quot;+snowletter+&amp;amp;quot;&amp;amp;lt;/span&amp;amp;gt;&amp;amp;quot;)
}
if (browserok) {
    window.onload=initsnow
}&amp;lt;/pre&amp;gt;
&amp;lt;p&amp;gt;Tiếp đ&amp;amp;oacute; trong trang chủ của bạn bạn include file n&amp;amp;agrave;y v&amp;amp;agrave;o phần header&amp;lt;/p&amp;gt;
&amp;lt;pre class=&amp;quot;brush: xhtml;&amp;quot; title=&amp;quot;code&amp;quot;&amp;gt;
&amp;amp;lt;!DOCTYPE HTML PUBLIC &amp;amp;quot;-//W3C//DTD HTML 4.01 Transitional//EN&amp;amp;quot;&amp;amp;gt;
&amp;amp;lt;html&amp;amp;gt;

&amp;amp;lt;head&amp;amp;gt;&amp;amp;lt;title&amp;amp;gt;Snow Effect Demo&amp;amp;lt;/title&amp;amp;gt;
&amp;amp;lt;meta http-equiv='Content-Type' content='text/html; charset=utf-8'&amp;amp;gt;
&amp;amp;lt;style type='text/css'&amp;amp;gt;
    &amp;amp;lt;!--
    body { background-color:#000; }
    --&amp;amp;gt;
&amp;amp;lt;/style&amp;amp;gt;
&amp;amp;lt;script type=&amp;amp;quot;text/javascript&amp;amp;quot; src=&amp;amp;quot;snow.js&amp;amp;quot;&amp;amp;gt;&amp;amp;lt;/script&amp;amp;gt;
&amp;amp;lt;/head&amp;amp;gt;
&amp;amp;lt;body&amp;amp;gt;

&amp;amp;lt;center&amp;amp;gt;&amp;amp;lt;h1&amp;amp;gt;Snow Effect Demo&amp;amp;lt;/h1&amp;amp;gt;&amp;amp;lt;/center&amp;amp;gt;

&amp;amp;lt;/body&amp;amp;gt;
&amp;amp;lt;/html&amp;amp;gt;
&amp;lt;/pre&amp;gt;
&amp;lt;p&amp;gt;B&amp;amp;acirc;y giờ th&amp;amp;igrave; quay lại trang chủ v&amp;amp;agrave; refresh lại nh&amp;amp;eacute; sẽ thấy ngay th&amp;amp;ocirc;i &amp;lt;img alt=&amp;quot;&amp;quot; src=&amp;quot;http://dev.meotom.net/Library/Editor/fckeditor/editor/images/smiley/yahoo/4.gif&amp;quot; /&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;a href=&amp;quot;http://demo.meotom.net/Snow_Effect/snow_effect.htm&amp;quot;&amp;gt;Demo&amp;lt;/a&amp;gt; |&amp;amp;nbsp;&amp;lt;a href=&amp;quot;http://dev.meotom.net/Uploads/admin/2009/12/11/snow_effect.zip&amp;quot;&amp;gt;Download Source&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;</Body><CommentEnabled>True</CommentEnabled><ViewCount>0</ViewCount><ReleaseDate>12/11/2009 7:14:54 PM</ReleaseDate><TotalComment>0</TotalComment><IsMedia>False</IsMedia><IsPicture>False</IsPicture><IsVote>True</IsVote><ArticlePassword /><PostVisible>0</PostVisible><ArticlePath>/2009/12/11/Tao-hieu-ung-tuyet-roi-voi-Javascript-29B</ArticlePath><Approved>True</Approved><ImagePath /><CategoryId>30</CategoryId><ArrayCatID>30|25</ArrayCatID></Article></Articles>